﻿<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
    <meta name="renderer" content="webkit">
    <title>大众之旅</title>
    <link href="/static/home/css/normalize.css" rel="stylesheet">
    <link href="/static/home/css/bootatrap/bootstrap.min.css" rel="stylesheet">
    <link href="/static/home/css/mixin.css" rel="stylesheet">
    <link href="/static/home/css/style.css" rel="stylesheet">
</head>

<body>
    <!-- 头部 -->
    <header class="boder_bn">
        <div class="top">
            <div class="typearea">
                <div class="fl">
                    <span>欢迎来到大众之旅!</span>
                    <a href="{:url('login/login')}" class="login_ing"><span class="ml_15 color_o">请登录</span></a>
                    <a href="{:url('login/register')}" class="login_ing"><span class="ml_15">会员注册</span></a>
                    <a class="login_ed"><span class="ml_15 color_o">{if $Think.session.userinfo.username}{$Think.session.userinfo.username}{else}{$Think.session.userinfo.phone}{/if}</span></a>
                    <a class="login_ed login_out" style="cursor:pointer;"><span class="ml_15">退出!</span></a>
                </div>
                <div class="fr">
                    <a href="{:url('my/my')}#order"><span>我的订单</span></a>
                    <a href="{:url('my/my_cart')}"><span class="ml_30">我的购物车</span></a>
                </div>
            </div>
        </div>
        <div class="center">
            <div class="typearea">
                <div class="fl">
                    <img class="logo_img" src="/static/home/img/logo.png" alt="">
                </div>
                <div class="fr">
                    <div class="search input-group">
                        <input type="text" class="form-control" name="keyword">
                        <div class="search_btn btn-group">
                            <a id="search" class="btn">
                                <img src="/static/home/img/s.jpg" alt="">
                            </a>
                        </div>
                    </div>
                    <!-- <div class="mycart">
                        <img src="/static/home/img/cart.png" alt="">
                        <span>我的购物车(0)</span>
                    </div> -->
                </div>
            </div>
        </div>
        <div class="bottom">
            <div class="typearea">
                <div class="fl">
                    <!-- Single button -->
                    <div class="btn-group">
                        <div class="all_product">
                            <div data-toggle="dropdown"
                                aria-haspopup="true" aria-expanded="false">
                                全部商品分类 <span class="caret"></span>
                            </div>
                            <ul class="dropdown-menu">
                                {foreach $cates as $key=>$value }
                                    <li>
                                        <a href="{:url('product/product')}?c_id={$value.id}">
                                            <div class="fl">
                                                <p>{$value.catename}</p>
                                                <p class="gray">{$value.intro}</p>
                                            </div>
                                            <span class="glyphicon glyphicon-menu-right fr"></span>
                                        </a>
                                    </li>
                                {/foreach}
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="fr">
                    <ul>
                        <li><a href="{:url('index/index')}">商城首页</a></li>
                        <li><a href="{:url('product/product')}">农副产品</a></li>
                        <li><a href="{:url('scenic/scenic')}?flag_type=0">景区门票</a></li>
                        <li><a href="{:url('scenic/scenic')}?flag_type=2">免费景区</a></li>
                        <li><a href="{:url('product/product')}?discount=1">折扣专区</a></li>
                    </ul>
                </div>
            </div>
        </div>
    </header>

    <div class="myCart">
        <div class="typearea">
            <!-- 进度 -->
            <div class="header">
                <div class="header_act">1.我的购物车</div>
                <img src="/static/home/img/next.jpg" alt="">
                <div>2.填写订单信息</div>
                <img src="/static/home/img/next.jpg" alt="">
                <div>3.成功提交订单</div>
            </div>
            <table>
                <thead>
                    <tr class="checkAll">
                        <th><input type="checkbox" onClick="checkAlls();" name="allselect"><span class="ml_5">全选</span></th>
                        <th>商品</th>
                        <th>规格</th>
                        <th>单价(元)</th>
                        <th>数量</th>
                        <th>小计</th>
                    </tr>
                </thead>
                <tbody>
                    <tr class="bg_gray"></tr>
                    {foreach $carts as $key=>$value }
                        <tr class="checkItem">
                            <td><input type="checkbox" value="{$value.id}" onClick="checkBoxx({$value.id},{$key});" name="allcheck"></td>
                            <td>
                                <img src="{$value.title_img.img}">
                                <span class="ml_10">{$value.title_img.title}</span>
                            </td>
                            <td>{if $value.type=1}{$value.title_img.combination}{/if}</td>
                            <td>{$value.title_img.price}</td>
                            <td>
                                <div class="box">
                                    <button onClick="comp({$key});" class="buy_dec">-</button>
                                    <input onkeyup="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')}" onafterpaste="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')}" type="number" name="buy_num" class="num_{$key}" value="{$value.buy_num}">
                                    <button onClick="add({$key});" class="buy_inc">+</button>
                                </div>
                            </td>
                            <td>{:bcmul($value.title_img.price,$value.buy_num,2)}</td>
                        </tr>
                    {/foreach}
                    <tr class="bg_gray"></tr>
                    <tr class="manger">
                        <td colspan="3"><span style="cursor:pointer;" id="checkselectdelete" class="ml_30">删除选中的产品</span></td>
                        <td colspan="3">
                            <span>已选择&nbsp;<i class="nums">0</i>&nbsp;件商品</span>
                            <span class="ml_10">总价（免邮）：</span>
                            <span class="price"> ¥<span class="moneys">0</span></span>
                            <div class="btn-group fr">
                                <div class="btn toPay fr" id="buy_now">去支付</div> 
                            </div>
                        </td>
                    </tr>
                    <tr class="bg_gray"></tr>
                </tbody>

            </table>
            <!-- 猜你喜欢 -->
            <!-- <div class="like">
                <div class="fl"></div>
                <div>猜你喜欢</div>
                <div class="fr"></div>
            </div>
            <ul class="product_list ">
                <li>
                    <img src="/static/home/img/np1.jpg" alt="">
                    <div class="name">新鲜青辣椒大虎皮青椒薄皮5斤现新鲜青辣椒大虎皮青椒薄皮5斤现…</div>
                    <div class="num">已售121件</div>
                    <div class="price">￥6.6</div>
                    <img src="/static/home/img/car2.jpg" alt="">
                </li>
                <li>
                    <img src="/static/home/img/np1.jpg" alt="">
                    <div class="name">新鲜青辣椒大虎皮青椒薄皮5斤现新鲜青辣椒大虎皮青椒薄皮5斤现…</div>
                    <div class="num">已售121件</div>
                    <div class="price">￥6.6</div>
                    <img src="/static/home/img/car2.jpg" alt="">
                </li>
                <li>
                    <img src="/static/home/img/np1.jpg" alt="">
                    <div class="name">新鲜青辣椒大虎皮青椒薄皮5斤现新鲜青辣椒大虎皮青椒薄皮5斤现…</div>
                    <div class="num">已售121件</div>
                    <div class="price">￥6.6</div>
                    <img src="/static/home/img/car2.jpg" alt="">
                </li>
                <li>
                    <img src="/static/home/img/np1.jpg" alt="">
                    <div class="name">新鲜青辣椒大虎皮青椒薄皮5斤现新鲜青辣椒大虎皮青椒薄皮5斤现…</div>
                    <div class="num">已售121件</div>
                    <div class="price">￥6.6</div>
                    <img src="/static/home/img/car2.jpg" alt="">
                </li>
            </ul> -->
        </div>
    </div>
    
    <!-- 尾部 -->
    <footer>
        <div class="f_top">
            <div class="typearea">
                <ul>
                    <li>
                        <img src="/static/home/img/b1.jpg" alt="">
                        <span>正品保障</span>
                    </li>
                    <li>
                        <img src="/static/home/img/b2.jpg" alt="">
                        <span>好评如潮</span>
                    </li>
                    <li>
                        <img src="/static/home/img/b3.jpg" alt="">
                        <span>闪电发货</span>
                    </li>
                    <li>
                        <img src="/static/home/img/b4.jpg" alt="">
                        <span>权威荣誉</span>
                    </li>
                </ul>
            </div>
        </div>
        <div class="f_center">
            <div class="typearea">
                <div class="contact">
                    <div class="con_t">
                        <img src="/static/home/img/b5.jpg" alt="">
                        <div class="con_tr ml_10">
                            <div>{$system.ser_tel}</div>
                            <div>服务时间：{$system.ser_time}</div>
                        </div>
                    </div>
                    <div class="mt_20">地址：{$system.address}</div>
                    <div class="mt_20">邮箱：{$system.email}</div>
                </div>
                <ul>
                    <li>购物指南</li>
                    <li><a href="javascript:0">我的购物车</a></li>
                    <li><a href="javascript:0">查看订单</a></li>
                    <li><a href="javascript:0">取消订单</a></li>
                </ul>
                <ul>
                    <li>帮助中心</li>
                    <li><a href="javascript:0">用户注册</a></li>
                    <li><a href="javascript:0">用户登录</a></li>
                    <li><a href="javascript:0">配送说明</a></li>
                </ul>
                <ul>
                    <li>服务保证</li>
                    <li><a href="javascript:0">产品质量保证</a></li>
                    <li><a href="javascript:0">售后服务保证</a></li>
                    <li><a href="javascript:0">联系我们</a></li>
                </ul>
                <div class="fr">
                    <div>
                        <div id="qy_qrcode">
                            
                        </div>
                        <p style="text-align:center;">企业官网</p>
                    </div>
                    <div class="ml_30">
                        <div id="shop_qrcode">
                            
                        </div>
                        <p style="text-align:center;">微信商城</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="f_bottom">
            <div class="typearea">
                版权所有 ©{$system.copyright}&nbsp;&nbsp;&nbsp;&nbsp;{$system.company}&nbsp;&nbsp;&nbsp;&nbsp;{$system.icp}
            </div>
        </div>
    </footer>
    <script src="/static/home/js/bootstrap/jquery.min.js"></script>
    <script src="/static/home/js/bootstrap/bootstrap.min.js"></script>
    <script type="text/javascript" src="/static/lib/layer/2.4/layer.js"></script>
    <script type="text/javascript" src="/static/h-ui/js/H-ui.min.js"></script>
    <script src="/static/home/js/qrcode.min.js"></script>
    <script src="/static/lib/layer/2.4/layer.js"></script>
    <script>
        var qrcode = new QRCode(document.getElementById("qy_qrcode"), {
            text: "{$url}/index/index/index.html",
            width: 88,
            height: 88,
            colorDark : "#000000",
            colorLight : "#ffffff",
            correctLevel : QRCode.CorrectLevel.H
        });

        var qrcode = new QRCode(document.getElementById("shop_qrcode"), {
            text: "{$url}/h5/index.html",
            width: 88,
            height: 88,
            colorDark : "#000000",
            colorLight : "#ffffff",
            correctLevel : QRCode.CorrectLevel.H
        });
        var carts_arr=[];
        var moneys=0;
        var nums=0;
        $(function(){
            if(window.localStorage.getItem("Token")){
                $(".login_ing").css("display","none");
                $(".login_ed").css("display","unset");
            }
            $(".login_out").click(function() {
                window.localStorage.setItem("Token",'');
                $(".login_ing").css("display","unset");
                $(".login_ed").css("display","none");
                $.ajax({
                    type: 'POST',
                    url: "{:url('/shop/login/login_out')}",
                    data:{},
                    success: function(data){
                        console.log(data)
                        window.location.href="/shop/index/index.html";
                    },
                    error:function(data) {
                        console.log(data.msg);
                    },
                }); 
            });
            var arr=<?php echo json_encode($carts);?>;
            var aarr=eval(arr);
            for(i=0;i<aarr.length;i++){
        　　　　var a = aarr[i];
                carts_arr.push(a)
            }
        });
        $("#checkselectdelete").on('click',function(){
            var ids = new Array();
            var check = $("input[type=checkbox][name=allcheck]:checked");
            check.each(function(i){
                ids[i] = $(this).val();
            });
            layer.confirm('确认要删除吗？',function(index){
                $.ajax({
                    type: 'POST',
                    url: 'cart_del',
                    data:{id:ids},
                    success: function(data){
                        window.location.replace(location.href);
                    },
                    error:function(data) {
                        console.log(data.msg);
                    },
                });     
            });
        });

        function checkBoxx(id,index){
            moneys=0
            nums=0

            var i_arr=[];
            for (var j = 0; j < carts_arr.length; j++) {
                if($("input[value="+carts_arr[j].id+"]").is(":checked")){
                    i_arr.push(j)
                }
            }

            for (var j = 0; j < carts_arr.length; j++) {
                for (var i = 0; i < i_arr.length; i++) {
                   if(j==i_arr[i]){
                        moneys=moneys+carts_arr[j].buy_num*carts_arr[j].title_img.price;
                        nums=nums+carts_arr[j].buy_num
                    } 
                }
                
            }
            moneys=moneys.toFixed(2)
            $(".moneys").text(moneys);
            $(".nums").text(nums);
            $(".num_"+index).val(carts_arr[index].buy_num);
        }
        function checkAlls(){
            if($("input[type='checkbox'][name=allselect]").is(':checked')==true){
                moneys=0
                nums=0
                for (var j = 0; j < carts_arr.length; j++) {
                    moneys=moneys+carts_arr[j].buy_num*carts_arr[j].title_img.price;
                    nums=nums+carts_arr[j].buy_num
                    
                }
                moneys=moneys.toFixed(2)
                $(".moneys").text(moneys);
                $(".nums").text(nums);
            }else{
                $(".moneys").text(0);
                $(".nums").text(0);
            }
            
        }
        function comp(index){
            if(carts_arr[index].buy_num>1){
                carts_arr[index].buy_num--
            }
            moneys=0;
            nums=0
            
            var i_arr=[];
            for (var j = 0; j < carts_arr.length; j++) {
                if($("input[value="+carts_arr[j].id+"]").is(":checked")){
                    i_arr.push(j)
                }
            }

            for (var j = 0; j < carts_arr.length; j++) {
                for (var i = 0; i < i_arr.length; i++) {
                   if(j==i_arr[i]){
                        moneys=moneys+carts_arr[j].buy_num*carts_arr[j].title_img.price
                        nums=nums+carts_arr[j].buy_num
                    } 
                }
                
            }
            moneys=moneys.toFixed(2)
            $(".moneys").text(moneys);
            $(".num_"+index).val(carts_arr[index].buy_num);
            $(".nums").text(nums);
        }
        function add(index){
            carts_arr[index].buy_num++;
            moneys=0
            nums=0
            var i_arr=[];
            for (var j = 0; j < carts_arr.length; j++) {
                if($("input[value="+carts_arr[j].id+"]").is(":checked")){
                    i_arr.push(j)
                }
            }
            for (var j = 0; j < carts_arr.length; j++) {
                for (var i = 0; i < i_arr.length; i++) {
                   if(j==i_arr[i]){
                        moneys=moneys+carts_arr[j].buy_num*carts_arr[j].title_img.price
                        nums=nums+carts_arr[j].buy_num
                    } 
                }
                
            }
            moneys=moneys.toFixed(2)
            $(".moneys").text(moneys);
            $(".num_"+index).val(carts_arr[index].buy_num);
            $(".nums").text(nums);
        }
        $("#buy_now").click(function() {
            if(window.localStorage.getItem("Token")){
                var carts=[];
                for (var j = 0; j < carts_arr.length; j++) {
                    if($("input[value="+carts_arr[j].id+"]").is(":checked")){
                        carts.push(carts_arr[j])
                    }
                }
                if(carts.length>0){
                    window.location.href="/shop/order/submit_orders.html?carts="+JSON.stringify(carts);
                }else{
                    layer.msg('您还未勾选',{icon:2,time:3000});
                }
            }else{
                window.location.href="/shop/login/login.html";
            }
        });
        $("#search").click(function() {
            layer.load(1, {
              shade: [0.1,'#fff'] //0.1透明度的白色背景
            });
            var keyword=$("input[name=keyword]").val();
            window.location.href="{$url}/shop/product/product.html?keyword="+keyword
            ;
        });
    </script>
</body>

</html>